<template>
    <div class="app-container">
        <el-button type="primary" @click="subtimTap">提交</el-button>
        <el-table v-loading="loading" :data="list" height="650" style="margin-top:10px"
            @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="人员密级" align="center" prop="dictLabel" />
            <el-table-column label="档案密级" align="center" prop="noticeType">
                <template slot-scope="scope">
                    <span v-for="(i, idx) in scope.row.getdamjdict" :key="idx">
                        <el-checkbox v-model="i.checked" style="margin-left: 20px;">{{ i.dictLabel }}</el-checkbox>
                    </span>
                </template>
            </el-table-column>

        </el-table>



    </div>
</template>
  
<script>
import { getrymjdict, getdamjdict, save, getmjdzb } from "@/api/system/mjdzb.js"
export default {
    data() {
        return {
            // 遮罩层
            loading: true,
            list: [],
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
        };
    },
    created() {

        getmjdzb().then(res => {
            if (res.data.length) { //回显有数据的时候显示
                const merged = [];
                var data = res.data;
                console.log(data, "sdkljfsdkljfklsdjf")
                // 使用 reduce 合并对象  
                const mergedData = data.reduce((accumulator, currentValue) => {
                    const key = `${currentValue.tableName}_${currentValue.ryMj}`; // 创建合并键  

                    // 如果累加器中没有对应的键，则添加新对象  
                    if (!accumulator[key]) {
                        accumulator[key] = {
                            ...currentValue, // 复制当前对象  
                            daMj: [currentValue.daMj] // 初始化 daMj 为数组  
                        };
                        // 删除不必要的 null 值（可选）  
                        ['createBy', 'createTime', 'filePath', 'menuId', 'remark', 'updateBy', 'updateTime'].forEach(prop => {
                            if (accumulator[key][prop] === null) {
                                delete accumulator[key][prop];
                            }
                        });
                    } else {

                        // 如果存在，则合并 daMj 字段  
                        accumulator[key].daMj.push(currentValue.daMj);
                    }

                    // 不返回累加器本身，因为我们正在构建一个对象而不是数组  
                    // 但 reduce 的结果最终会被转换为一个数组（如果需要的话）  
                    return accumulator;
                }, {});
                console.log(mergedData, "000000000000000000000")
                // 如果你想要一个数组而不是对象，你可以将对象转换为数组  
                const finalArray = Object.values(mergedData).map(item => ({
                    ...item,
                    // 如果需要将 daMj 转换回由逗号分隔的字符串  
                    daMj: item.daMj.join(',')
                }));
                this.loading = false;

                getrymjdict().then(res => {
                    console.log(res.data)
                    getdamjdict().then(e => {

                        for (var i in res.data) {
                            var arr = e.data.map(res => {
                                return {
                                    dictLabel: res.dictLabel,
                                    dictValue: res.dictValue,
                                    checked: false
                                }
                            })
                            res.data[i]["getdamjdict"] = arr
                            this.loading = false
                        }

                        for (var k in res.data) {
                            for (var r in finalArray) {
                                if (finalArray[r].ryMj == res.data[k].dictValue) {
                                    res.data[k]["daMj"] = finalArray[r].daMj.split(",")
                                    for (var a in res.data[k]["daMj"]) {
                                        for (var b in res.data[k]["getdamjdict"]) {
                                            if (res.data[k]["daMj"][a] == res.data[k]["getdamjdict"][b].dictValue) {
                                                res.data[k]["getdamjdict"][b].checked = true
                                            }
                                        }
                                    }



                                }
                            }
                        }



                        this.list = res.data
                        console.log(this.list)
                    })


                })
            } else { //回显接口没有数据的时候
                getrymjdict().then(res => {
                    getdamjdict().then(e => {
                        for (var i in res.data) {
                            var arr = e.data.map(res => {
                                return {
                                    dictLabel: res.dictLabel,
                                    dictValue: res.dictValue,
                                    checked: false
                                }
                            })
                            res.data[i]["getdamjdict"] = arr
                            this.loading = false
                        }
                        this.list = res.data
                        console.log(this.list, "888888888888888888888")

                    })
                })
            }


        })



    },
    methods: {

        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.dictValue)
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },
        subtimTap() {
            if(this.multiple){
                this.$message({ message: '请选择您要提交的数据哦！', type: 'warning' })
                return false
            }
            var data = this.list.map(res => {
                var arr = res.getdamjdict.filter(item => { return item.checked == true })
                var i = arr.map(e => { return parseInt(e.dictValue) })
                return {
                    rymj: res.dictValue,
                    damj: i
                }
            })

            var dataArr = data.filter(res => { return res.damj.length > 0 })
            console.log(dataArr, "999")
            save({ data: JSON.stringify(dataArr) }).then(res => {
                console.log(res)
                if (res.code == "200") {
                    this.$modal.msgSuccess("操作成功");
                }
            })
        }
    }
};
</script>
  
<style lang="scss" scoped>
.detail {
    height: 500px;
    overflow: auto;

    /* 或者使用 overflow: scroll; */
    ul {
        padding: 0;
    }

    li {
        line-height: 50px;
        height: 50px;
        display: flex;
        font-size: 16px;
        color: #606266;
    }

    li>label {
        width: 100px;
        text-align: right;
        margin-right: 10px;
    }
}
</style>
  